<template>
	<el-container>
		<el-main class='x-main-edit'>
			<el-form ref="form" :rules="form_rules" :model="form" size="mini" label-width="15%">
				<el-tabs type="border-card" v-model="page_tag">
					<!---->
					<!---->
					<el-tab-pane :label="page_info.title" name="1">
						<el-form-item label="分组" prop="cspu_cgroup_id">
							<el-select filterable v-model="form.cspu_cgroup_id" placeholder="请选择">
								<el-option v-for="item in page_info.list_group"
										   :label="item.cgroup_name"
										   :key="item.cgroup_id"
										   :value="item.cgroup_id">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="名称" prop="cspu_name">
							<el-input v-model="form.cspu_name" class="x-input-60" placeholder="例：丰田、本田"></el-input>
						</el-form-item>
						<el-form-item label="副标题" prop="cspu_title_sub">
							<el-input v-model="form.cspu_title_sub" class="x-input-60" placeholder="5座 | 快充"></el-input>
						</el-form-item>
						<el-form-item label="等级" prop="cspu_ctgroup_id">
							<el-select filterable v-model="form.cspu_level" placeholder="请选择">
								<el-option v-for="(item,index) in page_info.list_level"
										   :label="item"
										   :key="index"
										   :value="index">
								</el-option>
							</el-select>
						</el-form-item>
<!--						<el-form-item label="图片" prop="cspu_pic">-->
<!--							<x-upload-imgs ref="uploadEle" :sortable="true" :max-num="1"-->
<!--										   :rules="({ maxSize: 0.5})"-->
<!--										   :img_root="page_info.static_file_root"-->
<!--										   v-bind:value.sync="form.cspu_pic"-->
<!--										   :remote-fuc="g_page.funcUpdateImg"-->
<!--										   :before-upload="g_page.funcUpdateImgBefore"/>-->
<!--						</el-form-item>-->
						<el-form-item label="计费" prop="cspu_price_m1">
							1分钟
							<el-input-number v-model="form.cspu_price_m1" :min="0.01" :step="0.01" :precision="2"></el-input-number>
							元
						</el-form-item>
						<el-form-item label="无忧保障" prop="cspu_price_safe_h1">
							1小时
							<el-input-number v-model="form.cspu_price_safe_h1" :min="0.01" :step="0.01" :precision="2"></el-input-number>
							元，
							1日最高
							<el-input-number v-model="form.cspu_price_safe_max" :min="0.01" :step="0.01" :precision="2"></el-input-number>
							元
						</el-form-item>
						<el-form-item label="日封顶时长" prop="cspu_m_day1_max">
							<el-input-number v-model="form.cspu_m_day1_max" :min="1" :step="1"></el-input-number>
							分钟
							<div class="x-alert">
								<span>超过日封顶时长，当天不再收费</span>
							</div>
						</el-form-item>
						<el-form-item label="日封顶收费" prop="cspu_price_plan">
							<div>
								工作日
								<el-input-number v-model="form.cspu_price_day1_max_weekdays" :min="0.01" :step="0.01" :precision="2"></el-input-number>
								元
							</div>
							<div>
								节假日
								<el-input-number v-model="form.cspu_price_day1_max_weekend" :min="0.01" :step="0.01" :precision="2"></el-input-number>
								元
							</div>
							<div class="x-alert">
								<span>节假日：需要<a href="javascript:;" @click="g_page.funcRedirectEdit('app_car__day__h__list')">自行配置</a></span>
							</div>
						</el-form-item>
						<el-form-item label="车辆类型" prop="cspu_type_car">
							<el-input v-model="form.cspu_type_car" class="x-input-60" placeholder="例：小型轿车、大型轿车"></el-input>
						</el-form-item>
						<el-form-item label="排序" prop="cspu_order">
							<el-input-number v-model="form.cspu_order" :step="1"></el-input-number>
						</el-form-item>
					</el-tab-pane>
					<!---->
					<!---->
					<el-tab-pane label="高级配置" name="2">
						<el-form-item label="用车限制" prop="cspu_only_plan">
							<el-radio-group v-model="form.cspu_only_plan">
								<el-radio :label="0">分时or套餐</el-radio>
								<el-radio :label="1">仅套餐</el-radio>
								<el-radio :label="2">仅分时</el-radio>
							</el-radio-group>
							<div class="x-alert">
								<span>仅套餐：只能购买套餐租车，不可使用分时租车</span><br/>
								<span>仅分时：只能分时租车，不可使用套餐</span><br/>
							</div>
						</el-form-item>
					</el-tab-pane>
					<!---->
					<!---->
				</el-tabs>
			</el-form>
			<!---->
			<!---->
			<!-- 按钮部分 -->
			<div class="save_wrap">
				<el-button @click="g_page.funcBack" size="mini">返回</el-button>
				<el-button type="success" @click="g_page.funcSave" size="mini">保存</el-button>
				<el-checkbox v-if="page_info.is_admin_edit" style="margin-left: 10px;" label="保存后停留" v-model="checked"/>
			</div>
			<!---->
			<!---->
			<!---->
		</el-main>
	</el-container>
</template>

<script>
	import Tinymce from '@/components/Tinymce'

	export default {
		components: {
			Tinymce
		},
		data() {
			let page_data = {}
			//
			page_data = this.g_cc.funcGetInitData(page_data)
			//
			return page_data
		},
		mounted() {
			console.log('mounted')
			console.log(this.$route.query)

			this.g_page.funcSetVue(this)
			//
			this.g_page.funcSetApiUrlEdit('/xadmin/app_car/app_car__spu__edit')
			this.g_page.funcSetApiUrlSave('/xadmin/app_car/app_car__spu__edit/save')
			let page = this
			//验证
			this.form_rules = {
				__test: [{
					required: true,
					message: '请输入原密码',
					trigger: 'blur'
				}]
			}

			let data = this.$route.query
			this.g_page.funcEdit(data)
		},
		methods: {
			funcShowDialogAfter() {
				console.log('funcShowDialogAfter')
			},
			//保存之前
			funcSaveBefore(data) {
				console.log('funcSaveBefore', data)

				// data.abc_str_00 = this.g_page.funcImgArrToStr(data.abc_str_00_imgs)

				return data
			}
		}
	}
</script>
